<div class="card-block">
  <div class="progress-static">
    <div class="progress-meter" [attr.data-value]="res.progressPercent"></div>
  </div>
  <div class="clr-row clr-align-items-center">
    <div class="researchIcon" *ngIf="res.shape">
      <clr-icon [attr.shape]="res.shape" size="36"></clr-icon>
    </div>

    <div class="clr-col">
      <h4 class="card-title">
        {{ res.name }}
        <span>{{ res.number }}</span>

        <span class="res-progress">
          <app-formatted-quantity
            [quantity]="res.progress"
            [integer]="true"
          ></app-formatted-quantity>
          /
          <app-formatted-quantity
            [quantity]="res.total"
            [integer]="true"
          ></app-formatted-quantity>
        </span>
      </h4>
      <p class="card-text">{{ res.description }}</p>
    </div>
  </div>
</div>
